<template>
  <div>
    <router-link tag="div" :to="textArray.url" class="frsbc bgff container" @click="navigateToDestination">
      <span class="text c65" v-text="textArray.text"></span>
      <img class="arrow-right" :src="arrowRight" alt="">
    </router-link>
  </div>
</template>

<script>
export default {
  props: ['textArray'],
  data () {
    return {
      arrowRight: require('@/common/image/arrow-right.png')
    }
  },
  methods: {
    navigateToDestination () {

    }
  }
}
</script>

<style lang="stylus" scoped>
@import '~common/stylus/variable.styl'
.container
  padding 0 .20rem
  width 100vw
  height 1.00rem
  box-sizing border-box
  border-top 1px solid $ceb
  &:hover
    background-color $ceb
.text
  flex-grow 1
  font-size .28rem
.arrow-right
  height .30rem
  width .30rem
</style>
